import React, { PureComponent } from 'react';

let map
let traffic;
class MsgMap extends PureComponent {

  componentDidMount() {
    const { lng,lat,curPositionName } = this.props;
    map = new BMap.Map("bMapDiv");
    map.enableScrollWheelZoom(true);
    this.addMapMarker(lng,lat,curPositionName)
  }

  addMapMarker = (lng,lat,curPositionName) =>{
    if(curPositionName == null){
      var point = new BMap.Point(lng,lat);
      map.centerAndZoom(point, 15);
      var mk = new BMap.Marker(point);
      map.addOverlay(mk);
    }else {
      var point = new BMap.Point(lng,lat);
      map.centerAndZoom(point, 15);
      var marker = new BMap.Marker(point);  // 创建标注
      map.addOverlay(marker);              // 将标注添加到地图中

      var label = new BMap.Label(curPositionName,{offset:new BMap.Size(20,-10)});  // 创建文本标注对象
      label.setStyle({
        color : "red",
        fontSize : "12px",
        height : "20px",
        lineHeight : "20px",
        fontFamily:"微软雅黑"
      });
      marker.setLabel(label);
    }
    traffic = new BMap.TrafficLayer();
    map.addTileLayer(traffic);
  }


  render() {

    return (
      <div id="bMapDiv" style={{width:'100%',height:400}}></div>
    );
  }
}

export default MsgMap;
